* {
    margin: 0;
    padding: 0;
}

body {
    font-family: "microsoft yahei";
    min-width: 1200px;
}

li {
    list-style: none;
}

a:hover {
    text-decoration: none;
}

nav {
    height: 60px;
    background: black;
    color: #fff;
}

.navbar-brand {
    padding: 0;
}

#logo {
    display: inline-block;
    width: 120px;
    height: 38px;
    margin: 10px 30px 0 30px;

}

.navbar {
    border-radius: 0;
    margin-bottom: 0;
}

.navbar-inverse .navbar-nav > li > a {

    color: #fff;
}

.navbar-inverse .ltul > li > a {
    width: 80px;
    height: 60px;
    text-align: center;
    line-height: 30px;
    margin-top: -1px;
}

.navbar-inverse .ltul > li > a:hover {
    background: #5e5e5e;
}

.navbar-inverse .navbar-nav > li > a[class^=grey] {
    color: #9d9d9d;
}

nav form .btn {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: #363c41 url("img/gsearch-sprite.png") no-repeat 0 0;
    border: 0;
    border-radius: 0;
}

nav form .btn:hover {
    background: #363c41 url("img/gsearch-sprite.png") no-repeat 0 -40px;
}

.navbar-form .form-group > .form-control {
    width: 210px;
    height: 30px;
    background: #363c41;
    border: 0;
    font-size: 12px;
    border-radius: 0;
    color: #fff;
}

.appicon {
    display: inline-block;
    width: 11px;
    height: 16px;
    background: url("img/head-app-icon.png") no-repeat 0 0;
    margin-right: 5px;
}

.navbar-inverse .rtul > li > a {
    height: 60px;
}

.navbar-inverse .rtul > li > a:hover {
    background: #5e5e5e;
    margin-top: -1px;

}

.navbar-inverse .rtul > li > a.logon:hover {
    background: #cc0000;
}

nav .navbar-form {
    margin-top: 15px;
}

header .container-fluid {
    margin-top: -1px;
}

/*主体*/
.imgcar {
    width: 100%;
    height: 600px;
    position: relative;
}

.bgimg {
    width: 100%;
    height: 600px;
    background: url("img/banner2.jpg") no-repeat center center;
}

.swiper-container {
    width: 100%;
    height: 100%;

}

.imga {
    display: block;
    width: 100%;
    height: 600px;
    background: url(img/600.jpg) no-repeat center center;
}

.imgcar .swiper-button-next {
    width: 80px;
    height: 100px;
    position: absolute;
    left: 100%;
    top: 250px;
    margin-left: -80px;
    background: url(img/banner_sprite.png) no-repeat 0 -145px;
}

.imgcar .swiper-button-prev {
    width: 80px;
    height: 100px;
    position: absolute;
    left: -2px;
    top: 250px;
    background: url(img/banner_sprite.png) no-repeat 0 -45px;
}

.btn {
    display: none;
}
/*.main2{*/
    /*position: relative;*/
    /*z-index: 50;*/
/*}*/

.main2inner {
    width: 960px;
    height: 283px;
    line-height: 283px;
    margin: 0 auto;
    z-index: 180;
}

.main2inner img{
    opacity: 0;
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 160;
}
.main2inner .center {
    margin: 0 235px;
}

.main3 {
    height: 400px;
    width: 100%;
    background: #eef1f2;
    position: relative;
    z-index: 60;
}

.sameinner {
    width: 1200px;
    height: 400px;
    margin: 0 auto;
    position: relative;
}
.star {
    position: absolute;
    top: -20px;
    left: -15px;
    opacity: 0;
    /*z-index: 111;*/
}

.video {
    position: absolute;
   bottom: -20px;
    left: -15px;
    opacity: 0;
}

.text {
    position: absolute;
    top: 168px;
    left: 600px;
    opacity: 0;
}

.main4 {
    height: 400px;
    background: #fff;
    position: relative;
    z-index: 70;
}

.text2 {
    position: absolute;
    top: 168px;
    left: 105px;
    opacity: 0;
}

.computer1,.computer2 {
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
}
.computer2{
    top: -30px;
}

.main5 {
    height: 400px;
    background: #eef1f2;
    position: relative;
    z-index: 80;
}

.main5 .calendar {
    position: absolute;
    top: -21px;
    left: 0;
    opacity: 0;
}

.main5 .rockets {
    position: absolute;
    top: -16px;
    left: 0;
    opacity: 0;
}

.main5 .smoke {
    position: absolute;
    top: -1px;
    /*z-index: 2;*/
    opacity: 0;
}

.text3 {
    position: absolute;
    top: 165px;
    left: 559px;
    opacity: 0;
}
.main6{
    background: #fff;
    position: relative;
    z-index:90;
}
.hand {
    position: absolute;
    top: -10px;
    right: 0;
    opacity: 0;
    z-index: -55;
}

.text4 {
    position: absolute;
    top: 165px;
    left: 145px;
    opacity: 0;
}

.icon {
    position: absolute;
    top: -30px;
    right: 0;
    opacity: 0;
}

.lessonlist {
    width: 100%;
    height: 951px;
    background: #eef1f2;
    position: relative;
    z-index: 100;

}

.threelink {
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;

}

.threelink > a {
    display: block;
    width: 400px;
    height: 200px;
    float: left;
    border: 1px solid #fff;
    border-top: 0;
    border-bottom: 0;
}

.lessonfont {
    width: 64px;
    height: 31px;
    margin: 40px auto;
}

/*list部分*/
.list {
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
}

.list-box {
    float: left;
    margin: 10px;
    box-shadow: 0 1px 2px #c5c5c5;
    width: 280px;
    border-top: 0;
}

.imgwrap {
    width: 280px;
    height: 160px;
    overflow: hidden;
}

.main2inner img {
    position: relative;
}

.shadow {
    box-shadow: 0 3px 8px #c5c5c5;
}

.textwrap {
    width: 280px;
    height: 80px;
    background: #fff;
    padding: 10px 15px;
    position: relative;
}

.cap {
    color: #363d40;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 5px 0 15px;
}

.int {
    color: #b4bbbf;
    font-size: 12px;
    overflow: hidden;
    position: relative;
    width: 250px;
}

.after {
    position: absolute;
    left: 15px;
    top: 10px;
    display: none;
}

.int .time {
    float: left;
}

.int .people {
    float: right;
}

.after p:first-child {
    color: #363d40;
    font-size: 12px;
    margin: 2px 0 23px;
}

.duration {
    position: absolute;
    top: 0;
    right: 0;
}

/*total-lesson*/
.total-lesson a {
    display: block;
    width: 120px;
    height: 40px;
    margin: 40px auto;
    border: 1px solid #d0d6d9;
    border-radius: 30px;
    text-align: center;
    line-height: 40px;
    color: #363d40;
    font-size: 16px;
}

.total-lesson a:hover {
    background: #d0d6d9;
}

/*图片墙*/
.picture {
    width: 100%;
    height: 400px;
    background: url(img/family-bg2.png) no-repeat center center;
    position: relative;
}

.picture-inner {
    width: 1200px;
    height: 400px;
    margin: 0 auto;

}

.picture-inner ul li {
    float: left;
    width: 200px;
    height: 200px;
    position: relative;
}

.picture-inner ul li a {
    float: left;
}

.cover {
    width: 100%;
    height: 100%;
    background: #edf1f4;
    opacity: .6;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
    text-align: center;
    line-height: 400px;
}

ul, h3, p {
    margin: 0;
}

.two a {
    display: block;
    width: 200px;
    height: 200px;
    position: relative;
}

.one a {
    display: block;
    width: 100px;
    height: 100px;
    position: relative;
}

.picture-inner a span {
    display: block;
    width: 100%;
    height: 100%;
    background: #a8acaf;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .6;
    transition: opacity .1s;
}

.picture-inner a span:hover {
    opacity: 0;
}

.tworedbox {
    width: 300px;
    height: 200px;
    background: #be3948;
    z-index: 340;
    padding: 20px;

}

.Rango {
    position: absolute;
    top: 0;
    left: 200px;
    display: none;
}

h3 {
    font-size: 18px;
    color: #fff;
}

.tworedbox h4 {
    font-size: 12px;
    color: #ec9ba4;
}

.tworedbox p {
    font-size: 12px;
    color: #f2bcc2;
    margin-top: 30px;
}

.redbox {
    width: 200px;
    height: 100px;
    background: #be3948;
    z-index: 131;
    padding: 10px 15px;
    color: #ec9ba4;
    font-size: 12px;
}

.leejersey {
    position: absolute;
    top: 0;
    left: 100px;
    display: none;
}

.redbox div {
    float: left;
}

.web {
    margin-bottom: 15px;
}

.hour, .les {
    color: #fff;
}

.enroll-info {
    margin-left: 13px;
    text-align: left;
}

.weblist {
    position: absolute;
    left: 200px;
    top: 0;
    display: none;
}

.Raymond {
    position: absolute;
    left: 100px;
    top: 100px;
    display: none;
}

.xioae {
    position: absolute;
    left: 200px;
    top: 100px;
    display: none;
}

.Pangee {
    position: absolute;
    left: 200px;
    top: 0;
    display: none;
}

.liuyubobobo {
    position: absolute;
    left: -300px;
    top: 0;
    display: none;
}

.lvshi {
    position: absolute;
    left: -200px;
    top: 0;
    display: none;
}

.suannai {
    position: absolute;
    left: -100px;
    top: 0;
    display: none;
}

.O_Duok {
    position: absolute;
    left: -200px;
    top: 100px;
    display: none;
}

.w7851435 {
    position: absolute;
    left: -100px;
    top: 100px;
    display: none;
}

/*手机慕课*/
.phoneweb {
    height: 580px;
    background: url(img/mobile-bg.png);
    padding-top: 80px;
}

.phonetext {
    width: 347px;
    margin: 0 auto;
}

.version {
    width: 378px;
    height: 40px;
    margin: 40px auto 80px;

}

.mobile, .ipad {
    display: block;
    width: 160px;
    height: 40px;
    border-radius: 30px;
    border: 1px solid #be3948;
    text-align: center;
    line-height: 40px;
    float: left;
    color: #be3948;
}

.ipad:visited {
    color: #be3948;
    text-decoration: none;
}

.ipad:hover {
    background: #be3948;
    color: #fff;
}

.mobile:visited {
    color: #be3948;
    text-decoration: none;
}

.mobile:hover {
    background: #be3948;
    color: #fff;
}

.code {
    width: 18px;
    height: 18px;
    background: url(img/index2-sprite.png) no-repeat 0 -28px;
    float: left;
    margin-top: 11px;
    transition: background;
}

.code:hover {
    background: url(img/index2-sprite.png) no-repeat 0 0;
}

.ipad {
    margin: 0 15px 0 25px;
}

.mkwrap {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    cursor: pointer;
}

.mk-mobile {
    width: 804px;
    height: 307px;
    margin: 0 auto;
    background: url("img/mk-mobile-bg.png") no-repeat center center;
    position: relative;
    z-index: 90;
}

.mk-down {
    width: 417px;
    height: 192px;
    position: absolute;
    top: 50px;
    left: 393px;
    background: url("img/mk-down-qrcode.png") no-repeat center 31px;
}

.start {
    height: 360px;
    background: #eef1f2;
    padding-top: 70px;
}

.startfont {
    display: block;
    width: 220px;
    height: 60px;
    background: #be3948 url("img/begin-text.png") no-repeat center center;
    border-radius: 30px;
    margin: 0 auto;
    transition: opacity .2s;
}

.startfont:hover {
    opacity: .8;
}

.contact-info {
    width: 1200px;
    height: 134px;
    border-bottom: 1px solid #d0d6d9;
    margin: 0 auto;
    padding: 20px 0;
}

.contact-icon {
    width: 220px;
    height: 55px;
    margin: 0 auto;
}

.contact-icon a {
    display: block;
    width: 35px;
    height: 35px;
    margin: 10px;
    float: left;
    position: relative;
}

.contact-icon ul li:first-child a {
    background: url("img/idx-btm.png") no-repeat 0 -221px;
}

.contact-icon ul li:first-child a:hover {
    background: url("img/idx-btm.png") no-repeat 0 -262px;
}

.contact-icon ul li:nth-child(4n+2) a {
    background: url("img/idx-btm.png") no-repeat -49px -221px;
}

.contact-icon ul li:nth-child(4n+2) a:hover {
    background: url("img/idx-btm.png") no-repeat -49px -262px;
}

.contact-icon ul li:nth-child(4n+3) a {
    background: url("img/idx-btm.png") no-repeat -102px -221px;
}

.contact-icon ul li:nth-child(4n+3) a:hover {
    background: url("img/idx-btm.png") no-repeat -102px -262px;
}

.contact-icon ul li:last-child a {
    background: url("img/idx-btm.png") no-repeat -153px -221px;
}

.contact-icon ul li:last-child a:hover {
    background: url("img/idx-btm.png") no-repeat -153px -262px;
}

.scan {
    width: 176px;
    height: 220px;
    background: url("img/idx-btm.png") no-repeat 2px 2px;
    position: absolute;
    top: -220px;
    left: -71px;
    display: none;
}

.contact-font a {
    margin: 0 10px;
    float: left;
    color: #99a1a6;
}

.contact-font a:hover {
    color: #be3948;
}

.contact-font {
    width: 400px;
    margin: 15px auto 0;
}

.link-list {
    width: 1200px;
    height: 50px;
    margin: 0 auto;
    border-bottom: 1px solid #edf1f2;
    color: #c8cdd2;
}

.link-list li {
    float: left;
    margin: 0 10px;
}

.link-list li a {
    color: #c8cdd2;
}

.link-list li a:hover {
    color: #000;
}

.link-inner {
    width: 550px;
    height: 100%;
    margin: 0 auto;
    line-height: 50px;
}

.footp {
    color: #b4bbbf;
    text-align: center;
    margin: 20px;
    font-size: 13px;
}

.footimg {
    text-align: center;
    margin-bottom: 15px;
}

.footimg img {
    width: 89px;
}

.footimg img:hover {
    width: 127px;
}